import { ExtractPropTypes } from 'vue'
import { validatorColorValue, validatorSizeValue } from '../../utils'

/**
 * 分隔符配置
 */
export type CountToSeparator = {
  /** 十进制 */
  decimal?: string,
  /** 千分位 */
  thousandths?: string
}

/**
 * props参数
 */
export const countToProps = {
  /** 开始时的数值 */
  startValue: {
    type: [String, Number],
    default: 0
  },
  /** 结束时的数值 */
  endValue: {
    type: [String, Number],
    default: 0
  },
  /** 自动开始 */
  autoplay: {
    type: Boolean,
    default: true
  },
  /** 字体颜色, 支持内置颜色的值、十六进制、rgb()、rgba()的值 */
  color: {
    type: String,
    default: '',
    validator: (value: string) => {
      return validatorColorValue('color', value)
    }
  },
  /** 字体大小, 默认单位为rpx */
  fontSize: {
    type: [String, Number],
    default: '',
    validator: (value: string | number) => {
      return validatorSizeValue(value)
    }
  },
  /** 加粗显示 */
  bold: {
    type: Boolean,
    default: false
  },
  /** 滚动持续时间 */
  duration: {
    type: [String, Number],
    default: 2000
  },
  /** 显示的小数位数 */
  decimals: {
    type: [String, Number],
    default: 0
  },
  /** 分隔符配置 */
  separatorOption: {
    type: Object,
    default: (): CountToSeparator => {
      return {
        decimal: '.',
        thousandths: ''
      }
    }
  }
}
export type CountToProps = ExtractPropTypes<typeof countToProps>

export const countToEmits = {
  /** 滚动结束 */
  end: () => true
}
export type CountToEmits = typeof countToEmits
